<template>
   <!-- 项目施工现场情况调查表 -->
    <a-form-model
      ref="ruleForm"
      :model="form"
      :label-col="{ span: 6 }"
      :wrapper-col="{ span: 18 }"
      :rules="editModel == 0 ? {} : rules"
      :class="editModel == 0?'':'rulesForm'"
    >
      <a-spin :spinning="loading">
        <!-- 表格 -->
        <a-card :bordered="false">
          <title-name title="项目施工现场情况调查表"></title-name>
          <span class="scene">现场条件</span>
          <custom-form :formList="formList" :form="form" :is-emit="false" :editModel="editModel == 0 ? '' : ''">
            <!-- 附件上传 -->
            <template #fileInfoList >
              <div class="fileInfoList">
                  <span class="err-tip" v-if="fileInfoListRules && pageType!=='detail'">请上传现场情况及周边环境简图</span>
                  <div v-if="editModel == 0 && (!form.fileInfoList || form.fileInfoList.length < 1)" style="margin-top: -3px;margin-left:4px;">
                    无
                  </div>
                  <l-table
                    v-else
                    uploadType="image"
                    businessCode="PLAN01"
                    :disabled="editModel == 0"
                    :editModel="editModel"
                    :uploadArrys.sync="form.fileInfoList"
                    multiple
                  ></l-table>
              </div>
            </template>
          </custom-form>
        </a-card>
      </a-spin>
    </a-form-model>
     
</template>

<script>
import { planSiteInvestigationUpdateByEntity,getPlanSiteInvestigationById} from '@/api/projectManagementPlanning/constructionSiteSurvey'
import BaseEditPage from '@/views/baseEditPage' // 编辑详情页基础配置
import BSelect from '@/components/BComponents/BSelect'
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 分公司
import BUploadVModel from '@/components/BComponents/BUploadVModel'
export default {
  name: 'constructionSiteSurvey' + Date.now(),
  extends: new BaseEditPage(),
  props: {
    // 表单
    baseFormInfo: {
      type: Object,
      default: () => {}
    },
    },
  components: {
    SelectProject,
    BSelect,
    SelectSubCompany,
    BUploadVModel
  },
  data() {
    return {
      loading: false, // 加载控件
      visible: false, //人员选择控件
      editModel: 1, // 操作状态:0 查看;1 编辑
      form: {projectAddr:null,fileInfoList:[]}, // 表单
      id: '',
      loadingBtn: {
        DELETE: false,
        DRAFT: false,
        SUBMITTED: false,
        REJECTED: false
      },
      rules: {}, // 校验规则
      init: false, // 初始化控件
      fileInfoListRules:false
    }
  },
  watch: {
    'baseFormInfo':{
        handler (val, oldVal) {
          this.form.projectAddr =val?.projectAddress;
    },
    deep: true,
  },
  'form.fileInfoList':{
        handler (val, oldVal) {
         if(val?.length>0){
           this.fileInfoListRules = false;
         }else{
              this.fileInfoListRules = true;
         }
    },
    deep: true
    }

  },
  created() {},
  async mounted() {
   let msg = null;
      this.formList.map((item)=>{
          msg = item.label == '现场情况及周边环境简图'? "":`请输入${item.label}`;
          if(item.keyName!='fileInfoList'){
            this.rules[item.keyName]= [{ required: true, message: msg}];
          }
      })
    await this.getDetailData()
  },
  computed: {
    formList() {
      return [
        {
          keyName: 'demolition',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '拆迁情况',
          attrs: {
              maxLength : 30,
          },
        },
        {
          keyName: 'siteLeveling',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '场地平整',
          attrs: {
              maxLength : 30,
          },
        },
        {
          keyName: 'waterSupply',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '通水情况',
            attrs: {
              maxLength : 30,
          },
        },
        {
          keyName: 'powerOnCondition',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '通电情况',
          attrs: {
              maxLength : 30,
          },
        },
        {
          keyName: 'roadConditions',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '道路情况',
          attrs: {
              maxLength : 30,
          },
        },
         {
          keyName: 'sewageDischarge',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '污水排放',
           attrs: {
              maxLength : 30,
          },
        },
        {
          keyName: 'mainBridge',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '主要桥梁',
           attrs: {
              maxLength : 30,
          },
        },
         {
          keyName: 'disturbPeople',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '是否扰民',
           attrs: {
              maxLength : 30,
          },
        },
        {
          keyName: 'geologicalConditions',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '地质条件',
           attrs: {
              maxLength : 30,
          },
        },
        {
          keyName: 'surroundCommunities',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '周边社区',
           attrs: {
              maxLength : 30,
          },
        },
          {
          keyName: 'surroundEnvironment',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '周边环境',
           attrs: {
              maxLength : 30,
          },
        },
          {
          keyName: 'governmentOrgan',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '政府机构',
           attrs: {
              maxLength : 30,
          },
        },
           {
          keyName: 'constructionMaterials',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '施工材料',
           attrs: {
              maxLength : 30,
          },
        },
         {
          keyName: 'localLabor',
          type: 'BaseInput',
          disabled: this.editModel == 0,
          label: '当地劳务',
           attrs: {
              maxLength : 30,
          },
        },
        {
          keyName: 'overallEvaluation',
          type: 'BaseTextarea',
          label: '施工现场总体评价',
          disabled: this.editModel == 0,
          span: 24
        },
         {
          keyName: 'difficultProblem',
          type: 'BaseTextarea',
          label: '现场施工可能遭遇的疑难问题',
          disabled: this.editModel == 0,
          span: 24
        },
           {
          keyName: 'fileInfoList',
          slot: true,
          label: '现场情况及周边环境简图',
          span: 24
        }
      ]
    },
  },
  methods: {
    validateForm() {
      let flag = false
      this.$refs.ruleForm.validate((e) => {
        if (e) {
          flag = true
        }else {
          this.$message.warning('请填写完所有必填项信息')
        }
      })
      return flag
    },
    getDetailData() {
      // 不为添加时请求详情
      if (this.editModel != 2) {
        this.loading = true
        let reqObj = {
          planId: this.id
        }
        if(this.version){
         reqObj.version = this.version;
        }
        getPlanSiteInvestigationById(reqObj)
          .then((res) => {
            this.loading = false
            this.form = { ...this.form, ...res.data }
            this.$emit('setPerProjectAddress',res?.data?.projectAddr);
            this.$nextTick(() => {
              this.init = true
            })
          })
          .catch(() => {
            this.loading = false
          })
      } else {
        this.$nextTick(() => {
          this.init = true
        })
      }
    },
    sure(str){
      let that = this;
      this.$confirm({
        okText: '确认',
        okType: 'warning',
        cancelText: '取消',
        title: '提交?',
        content: `请确认是否要提交?`,
        onOk() {
            that.submitFn(str);
        },
        onCancel() {
        },
      })
    },
    constructionSiteSurveySaveDrafts(formBase) {  //保存草稿
          this.submitFn(1);

    },
    /**
     * 提交表单
     */
    constructionSiteSurveySubmit(formBase) {
      console.log(this.form.fileInfoList)
      if (!this.validateForm()) {
        return
      }
      if(!this.form.fileInfoList && !this.form.fileInfoList?.length || this.fileInfoListRules){
         this.fileInfoListRules = true;
         console.log( this.fileInfoListRules)
        return
      }
      this.sure(2);
    },
    submitFn(status){
      this.loading = true
      let form = this.$clone(this.form);
      let msg = status*1===2?"提交":"保存草稿";
      form.auditStatus = status;
      form.planId =  this.id;
      form.isChange = this.pageType=='change'?1:0;  // 是编辑还是变更
      form
      let api = planSiteInvestigationUpdateByEntity;
      api(form)
        .then(() => {
          this.loading = false
          this.$message.success(`${msg}成功！`);
          this.$multiTab.close()
        })
        .catch(() => {
          this.loading = false
          this.$message.warning(err.data.message)
        })
    }
  }
}
</script>
<style lang="less" scoped>
@deep: ~'>>>';
 .scene{
     display: block;
     margin: 10px 0 10px 60px;
     color: rgba(0, 0, 0, 0.85);
 }
 .rulesForm{
   @{deep} .ant-input{
     border-color: #e4ac0b;
     background-color: #FFF9E8;
   }
 }
 .fileInfoList{
   position: relative;
   .err-tip{
     position: absolute;
     bottom: -10px;
     left: 0;
     z-index: 1000;
     color: #f5222d;
   }
 }
</style>
